<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>


<?php
// 引入addres.php文件
include "./address.php";


// 判断 是否接收了 province 参数;如果有参数过来那么就查找市 在显示出来；
if(!empty($_GET['province'])){
	
		echo "<select class='province'>";
		foreach($address as $v){
			if($v['province_name'] == $_GET['province']){
				echo "<option selected>".$v['province_name']."</option>";
			}else{
				echo "<option>".$v['province_name']."</option>";
			}
			
		}
		echo "</select>";
	
		// 有省传入过来；
		// 获取市的信息；
		if(!empty($_GET['city'])){
			echo '<select class="city">';
			foreach($address as $v){
				if($v['province_name']==$_GET['province']){
					// 获取省底下的市；
					foreach($v['city'] as $vv){
						if($vv['city_name']==$_GET['city']){
							echo '<option selected>'.$vv['city_name'].'</option>';
						}else{
							echo '<option>'.$vv['city_name'].'</option>';
						}
					}
				}
			}
			echo '</select>';
			
			
			// 查询市底下的区 显示出来
			
			echo '<select class="arae">';
			foreach($address as $v){
				if($v['province_name']==$_GET['province']){
					// 获取省底下的市；
					foreach($v['city'] as $vv){
						if($vv['city_name']==$_GET['city']){  // 如果 当前省下的city 循环的名字和 get过来的数据相同了那么就循环底下的arae区
								foreach( $vv['area'] as $val){
									echo '<option>'.$val.'</option>';
								}
						}
						
					}
				}
			}
			echo '</select>';
			
			
		}else{
			echo '<select class="city">';
			foreach($address as $v){
				if($v['province_name']==$_GET['province']){
					// 获取省底下的市；
					foreach($v['city'] as $vv){
						echo '<option>'.$vv['city_name'].'</option>';
					}
				}
			}
			echo '</select>';
		}	
		
	
}else{
	// 没有任何参数过来那么就显现默认的省 ，没有选中状态的省份；
	echo "<select class='province'>";
	foreach($address as $v){
		echo "<option>".$v['province_name']."</option>";
	}
	echo "</select>";
}

// 选湖北省的时候 ：1.跳转当前页面2。带上湖北省的参数；
?>

	<script>
		// 获取省的信息
		var provinceEle = document.querySelector(".province");
		provinceEle.onchange = function(){
			// console.log(this.value);
			// 跳转当前页面
			window.location.href = "./addressshow.php?province="+this.value;
		}
		
		// 获取市的信息；
		
		var cityEle = document.querySelector(".city");
		cityEle.onchange = function(){
			let cityName = this.value;
			let provinceName = provinceEle.value;
			// console.log(provinceName,cityName);
			// 跳转到当前页面 获取具体的区的信息；
			window.location.href = `./addressshow.php?province=${provinceName}&city=${cityName}`;
		}
		
		
	</script>

	</body>
</html>
